import {
    Await,
} from "react-router-dom";
import React from 'react';
import { Suspense } from 'react';
import { Platform, StyleSheet, Text, TextInput, View, Button, ScrollView, Image } from 'react-native';

export function AwaitExample() {
    const [success, setSuccess] = React.useState(false);
    const asyncLoadData = () => {
        return new Promise((resolve, reject) => {
            // 异步操作，比如请求数据
            setTimeout(() => {
                (success && resolve({ message: '请求成功' }));
                (!success && reject(new Error("Kaboom!"),));
            }, 2000)
        });
    }

    return (<View style={{ backgroundColor: "blue" }}>
        <Text>Await页</Text>
        <Text>`----------返回结果:{success ? '成功结果' : '错误结果'}---------------`</Text>
        <Button title={"请求耗时操作"} onPress={() => {
            setSuccess(!success);
            asyncLoadData();
        }} />
        <Suspense fallback={<Text>加载中.....</Text>}>
            <Await resolve={asyncLoadData()} errorElement={<Text>`error 返回错误，做错误处理`</Text>}>
                <View>
                    <Text>`请求成功，处理成功页面显示`</Text>

                </View>
            </Await>
        </Suspense>
    </View>);
}

export default AwaitExample;
